<template>
	<!-- 个人信息 -->
	<view class="container container-bg">
		<u-form :model="form" :border-bottom="false" ref="uForm" label-width="auto">
			<u-form-item required="true" label="角色">
				<u-input :value="form.userType === 'wk' ? '员工' : '项目经理'" disabled />
			</u-form-item>
			<u-form-item required="true" label="姓名" prop="name" right-icon="server-man">
				<u-input v-model="form.name" placeholder="请输入姓名" />
			</u-form-item>
			<u-form-item required="true" label="电话" prop="phone" right-icon="phone">
				<u-input v-model="form.phone" placeholder="请输入手机号" />
			</u-form-item>
			<u-form-item :border-bottom="false" label-width="120" required="true" label="家庭住址" prop="address">
				<u-input v-model="form.address" placeholder="请选择家庭住址" type="select" :select-open="regionShow" @click="regionShow = true" />
				<u-picker mode="region" v-model="regionShow" @confirm="regionConfirm" :default-region='["北京市", "市辖区", "东城区"]'></u-picker>
			</u-form-item>
			<u-form-item label-width="0" required="true" prop="detailAddre">
				<u-input v-model="form.detailAddre" placeholder="详细地址: 如道路、门牌号、小区、楼栋号、单元寝等" />
			</u-form-item>
			<u-form-item label-width="120" required="true" label="证件号" right-icon="account" prop="idCard">
				<u-input v-model="form.idCard" placeholder="请输入证件号" />
			</u-form-item>
			<u-form-item label-width="120" required="true" right-icon="rmb-circle" label="卡号" prop="bankID">
				<u-input v-model="form.bankID" placeholder="请输入卡号" />
			</u-form-item>
			<u-form-item label-width="120" required="true" label="工人编号" prop="wkID">
				<view class="u-flex">
					<u-input class="u-flex-1" :disabled="!haveUserInfoShow ? false : true" v-model="form.wkID" placeholder="请输入工人编号" />
					<u-button v-if="!form.wkID" :disabled="getWkIDdisable" class="u-margin-left-20" type="primary" @click="getWKid"
					 size="mini">点击获取编号</u-button>
				</view>
			</u-form-item>
			<u-form-item required="true" label="性别" prop="sex">
				<u-input v-model="form.sex" placeholder="请选择性别" type="select" :select-open="show" @click="show = true" />
				<u-action-sheet :list="actionSheetList" v-model="show" @click="actionSheetCallback"></u-action-sheet>
			</u-form-item>
			<u-form-item required="true" label="密码" prop="password">
				<u-input v-model="form.password" type="password" :password-icon="false" placeholder="请设置密码,该密码将是后面修改个人信息的唯一凭证" />
			</u-form-item>
		</u-form>
		<u-button class='u-margin-20' :disabled="submitBtnDis" type="primary" @click="submit">保存</u-button>
	
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import getRandomID from "@/common/getRandomID.js";
	import {mapState,mapMutations} from "vuex";
	import {encrypt} from "@/common/encrypt.js";
	export default {
		data() {
			return {
				show: false,
				regionShow: false,
				getWkIDdisable: false,
				haveUserInfoShow: false,
				submitBtnDis:false,
				form: {
					name: '',
					phone: "",
					address: "",
					detailAddre: "",
					idCard: "",
					bankID: "",
					wkID: "",
					sex: '',
					userType: "wk", //wk员工 或者 pm项目经理
					_userID: "",
					password: "",
					pm_company:"", //所属公司的ID
					workStatus: 0 // 0 休息，1工作中
				},
				actionSheetList: [{
						text: '男'
					},
					{
						text: '女'
					}
				],
				rules: {
					name: [{
						required: true,
						message: '请输入姓名',
						trigger: ['blur', 'change']
					}],
					address: [{
						required: true,
						message: '请输入家庭住址',
						trigger: ['blur', 'change']
					}],
					detailAddre: [{
						required: true,
						message: '请输入详细地址：如道路、门牌号、小区、楼栋号、单元寝等',
						trigger: ['blur', 'change']
					}],
					sex: [{
						required: true,
						message: '请选择性别',
						trigger: ['blur', 'change']
					}],
					wkID: [{
						required: true,
						message: '请点击右边按钮获取编号',
						trigger: ['blur', 'change']
					}],
					phone: [{
							required: true,
							message: '请输入电话号码',
							trigger: ['blur', 'change']
						},
						{
							min: 11,
							max: 11,
							message: "请输入11位手机号码",
							trigger: ['blur', 'change']
						},
						{
							validator: (rule, value, callback) => {
								return this.$u.test.mobile(value);
							},
							message: "请输入正确的手机号码",
							trigger: ['blur', 'change']
						}
					],
					idCard: [{
							required: true,
							message: '请输入身份证号码',
							trigger: ['blur', 'change']
						},
						{
							validator: (rule, value, callback) => {
								return this.$u.test.idCard(value)
							},
							message: "请输入正确的身份证号码",
							trigger: ['blur', 'change']
						}
					],
					bankID: [{
							required: true,
							message: "请输入银行卡号",
							trigger: ['blur', 'change']
						},
						{
							validator: (rule, value, callback) => {
								let reg = /^([1-9]{1})(\d{15}|\d{18})$/;
								return reg.test(value);
							},
							message: "请输入正确的银行卡号码",
							trigger: ['blur', 'change']
						}
					],
					password: [{
							required: true,
							message: '请设置密码，此密码将是后面修改个人信息的唯一凭证',
							trigger: ['blur', 'change']
						},
						{
							validator: (rule, value, callback) => {
								let reg = /^\d{6}$/;
								return reg.test(value);
							},
							message: "请输入6位数字密码，此密码将是后面修改个人信息的唯一凭证",
							trigger: ['blur', 'change']
						}
					]
				}
			}
		},
		computed: {
			...mapState({
				userID: "userID",
				token: "token"
			})
		},
		// 设置校验规则
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		async onLoad(options) {
			// 获取用户数据/编辑
			if(options.haveUserInfoShow === 'true') this.haveUserInfoShow = true;
			if (this.haveUserInfoShow) {
				this.$loading("请稍后")
				let res = await this.$network({
					api: "main",
					data: {
						action:"user/getUserInfo",
						data:{
							_userID: this.userID,
							token:this.token
						}
					}
				})

				uni.hideLoading();
				if (res.status === 0) {
					let userData = res.data[0];
					userData.idCard = encrypt.decodeHex(userData.idCard);
					userData.bankID = encrypt.decodeHex(userData.bankID);
					userData.password = encrypt.decodeHex(userData.password);
					Object.assign(this.form, userData);
				}
			}
		},
		methods: {
			...mapMutations(['logout']),
			// 点击actionSheet回调
			actionSheetCallback(index) {
				this.form.sex = this.actionSheetList[index].text;
			},
			submit() {
				this.$refs.uForm.validate(async valid => {
					if (valid) {
						this.submitBtnDis = true;
						this.$loading("正在保存")
						// let md5Pass = md5Libs.md5(this.form.password);
						let userInfo = Object.assign(this.form, {"_userID": this.userID});
						let res = await this.$network({
							api: "main",
							data:{
								action:"user/setUserInfo",
								data:userInfo
							}
						});
						uni.hideLoading();
						this.submitBtnDis = false;
						if (res.status === 0) {
							this.logout();
							this.$refs.uToast.show({
								title: '保存成功,请重新登录!',
								type: 'success',
								url: '/pages/index/index'
							});
							
						}
					}
				});
			},
			//获取员工编号
			getWKid() {
				this.$loading("正在获取");
				this.getWkIDdisable = true;
				// （wk+8位随机数）
				var i = getRandomID();
				this.checkWorkerID("wk"+i);
			},
			// 验证获取的编号是否重复
			async checkWorkerID(id) {
				var res = await this.$network({
					api: "main",
					data: {
						action:"disposeData/checkWorkID",
						data:{id}
					}
				});
				
				console.log(res);
				if (res.status === 0) {
					uni.hideLoading();
					this.form.wkID = id;
					this.getWkIDdisable = false;
				} else if (res.status === 1) {
					this.getWKid(); // 重复，重新获取
				}
			},
			regionConfirm(res) {
				let area = res.area.label; //区
				let city = res.city.label; //市
				let province = res.province.label; //省
				this.form.address = `${province} ${city === '市辖区' ? '' : city} ${area}`
			}
		}
	}
</script>
